<template>
  <el-container style="height: 680px;border-radius: 3px">
    <el-aside width="200px" style="background-color: #FFF0F5">

      <el-menu router>
        <el-submenu v-for="(item,index) in $router.options.routes" :index="index+''" :key="index" v-if="item.show">
          <template slot="title"><i class="el-icon-setting"></i>{{item.name}}</template>
          <el-menu-item v-for="(item2,index2) in item.children" :index="item2.path" :key="index2">
            {{item2.name}}
          </el-menu-item>
        </el-submenu>
      </el-menu>

    </el-aside>
    <el-container>
      <el-header style="text-align: right; font-size: 12px;background-color:#00FFFF;">
        <el-link href='/user/gather' target="_self" style = "font-size:23px;margin-right:280px;">宠物商城-后台管理</el-link>
        <el-button type="primary"  @click="exit()" size = "mini" style = "margin-right:80px;">安全退出</el-button>
        <el-dropdown>
          <i class="el-icon-setting" style="margin-right: 15px"></i>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item>查看</el-dropdown-item>
            <el-dropdown-item>新增</el-dropdown-item>
            <el-dropdown-item>删除</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <span style="font-size:20px;">欢迎管理员:{{showLoginName}}</span>
      </el-header>

      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>

<script>
  import cookie from 'js-cookie'
  export default {
    name: "Index",
    methods: {
      exit() {
        this.$router.push('/')
        this.$message('退出登录')
      }
    },
    computed:{
      showLoginName(){
        return cookie.get('loginName_pet')
      }
    }
  }
</script>

<style scoped>

</style>
